import { Controlled as CodeMirror } from 'react-codemirror2';
import React, { useMemo } from 'react';
import { jsx as _jsx } from "react/jsx-runtime";
export default (function (props) {
  var _props$value = props.value,
    value = _props$value === void 0 ? '' : _props$value,
    onChange = props.onChange,
    _props$disabled = props.disabled,
    disabled = _props$disabled === void 0 ? false : _props$disabled,
    _props$formatJson = props.formatJson,
    formatJson = _props$formatJson === void 0 ? false : _props$formatJson,
    _props$mode = props.mode,
    mode = _props$mode === void 0 ? 'application/json' : _props$mode;
  var formatValue = useMemo(function () {
    if (mode === 'application/json' && formatJson && value) {
      try {
        var result = JSON.stringify(JSON.parse(value), null, '\t');
        return result;
      } catch (error) {
        return value;
      }
    }
    return '';
  }, [value]);
  return /*#__PURE__*/_jsx(CodeMirror, {
    value: formatJson ? formatValue : value,
    options: {
      mode: 'application/json',
      lineNumbers: true,
      readOnly: disabled
    },
    onBeforeChange: function onBeforeChange(editor, data, value) {
      onChange && onChange(value);
    }
  });
});